<template>
	<view class="recommend">
		<view class="recommend-item">
			<image class="item-big" src="../../server/public/images/hx3.jpg" mode=""></image>
			<view class="item-small">
				<image class="item-img" src="../../server/public/images/hx2.jpg" mode=""></image>
				<image class="item-img" src="../../server/public/images/hx2.jpg" mode=""></image>
				<image class="item-img" src="../../server/public/images/hx2.jpg" mode=""></image>
			</view>
		</view>
		
		<view class="recommend-item">
			<image class="item-big" src="../../server/public/images/hx3.jpg" mode=""></image>
			<view class="item-small">
				<image class="item-img" src="../../server/public/images/hx2.jpg" mode=""></image>
				<image class="item-img" src="../../server/public/images/hx2.jpg" mode=""></image>
				<image class="item-img" src="../../server/public/images/hx2.jpg" mode=""></image>
			</view>
		</view>
	</view>
</template>
class="item-img" 
<script>
</script>

<style scoped>
	.recommend{
		padding:20rpx;
		background-color: #42B7FB;
	}
	.recommend-item{
		display: flex;
		flex-direction: column;
		border-radius: 20rpx;
		border: 2rpx solid #cccccc;
		overflow: hidden;
		margin: 20rpx 0	;
	}
	.item-big{
		width: 100%;
		height: 300rpx;
	}
	.item-small{
		width: 100%;
		height: 240rpx;
	}
	.item-img{
		width: 33.3333%;
		height: 240rpx;
	}
</style>